<template>
	<el-card shadow="hover" class="item-background">
		<template v-slot:header>
			常用流程
			<div style="float: right;display: inline-flex">
				<sc-icon style="cursor: pointer;width: 18px;" @click="setBpmQuick" title="设置"><el-icon-setting/></sc-icon>
			</div>
		</template>
		<el-row :gutter="0" class="box" style="height: 210px;overflow: auto;">
			<el-col :span="4" v-for="item in flowList" :key="item.value" @click="createBpm(item)">
				<div class="icon-box">
					<el-icon><sc-icon-apply/></el-icon>
					<div style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" :title="item.label">{{item.label}}</div>
				</div>
			</el-col>
		</el-row>
	</el-card>
	<bpmQuickSetting v-if="dialog.save" ref="saveDialog" @success="handleSaveSuccess" @closed="dialog.save=false"></bpmQuickSetting>
	<send-dialog v-if="dialog.sendDialog" ref="sendDialog" @closed="dialog.sendDialog=false"></send-dialog>
	<doc-send-dialog v-if="dialog.docSendDialog" ref="docSendDialog" @closed="dialog.docSendDialog=false"></doc-send-dialog>
	<doc-rev-dialog v-if="dialog.docRevDialog" ref="docRevDialog" @closed="dialog.docRevDialog=false"></doc-rev-dialog>
</template>

<script>

import bpmQuickSetting from "./bpmFlowSetting";
import sendDialog from "@/views/bpm/create/sendDialog";
import docSendDialog from "@/views/doc/docsend/sendDialog";
import docRevDialog from "@/views/doc/docrev/sendDialog";
export default {
	components: {sendDialog,docSendDialog,docRevDialog, bpmQuickSetting},
	data() {
		return {
			dialog:{
				save:false,
				sendDialog:false,
				docSendDialog:false,
				docRevDialog:false,
			},
			flowList:[],
		}
	},
	mounted() {
		this.getMyBpmQuickFlow();
	},
	methods: {
		createBpm(item){
			if(item.model=="0")
			{
				this.dialog.sendDialog = true
				this.$nextTick(() => {
					this.$refs.sendDialog.open().setData({flowId: item.value})
				})
			}else{
				if(item.isDoc=="1")
				{
					this.dialog.docSendDialog = true
					this.$nextTick(() => {
						this.$refs.docSendDialog.open().setData({flowId: item.value})
					})
				}else if(item.isDoc=="2")
				{
					this.dialog.docRevDialog = true
					this.$nextTick(() => {
						this.$refs.docRevDialog.open().setData({flowId: item.value})
					})
				}
			}
		},
		setBpmQuick()
		{
			this.dialog.save = true
			this.$nextTick(() => {
				this.$refs.saveDialog.open().setData(this.flowList)
			})
		},
		//本地更新数据
		handleSaveSuccess() {
			this.getMyBpmQuickFlow();
		},
		async getMyBpmQuickFlow()
		{
			var res = await this.$API.bpm.bpmQuick.getMyBpmQuickFlow.get();
			if (res.code == 200) {
				this.flowList = res.data
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		}
	}
}
</script>
<style scoped>
.item-background {background: linear-gradient(to right, rgb(64 158 255), #f89898);color: #fff;}
.icon-box {height:70px;text-align: center;cursor: pointer;}
.icon-box i {font-size: 26px;transition: color .15s linear;}
.icon-box:hover i, .icon-box:hover p {color: #5cb6ff;}
.icon-box p {color: #FFFFFF;margin-top: 15px;transition: color .15s linear;}
</style>
